import { Button, Modal, Steps } from 'antd';
import { useState, useEffect, useContext, useRef } from 'react';
import './index.less';
import MapGenerator from './MapGenerator';
import Scbg from './Scbg';
import Zqxq from './Zqxq';
import RiskReportContext from '../RiskReportContext';
export default function ReportGenerator(props) {

    const [currentStep, setCurrentStep] = useState(0);
    const [result, setResult] = useState({})
    const [loading, setLoading] = useState();

    const { zhData, yxfxData } = useContext(RiskReportContext);
    const mapRef = useRef();

    const items = [{
        key: 0,
        title: '灾情详情'
    }, {
        key: 1,
        title: '影响范围'
    }, {
        key: 2,
        title: '救援专题'
    }, {
        key: 3,
        title: '撤离专题'
    }, {
        key: 4,
        title: '物资储备专题'
    }, {
        key: 5,
        title: '生成报告'
    }]

    const [visible, setVisible] = useState();

    return <>
        <Button type="primary" onClick={e => {
            setVisible(true);
        }}>点击开始生成报告</Button>
        <Modal wrapClassName='bgsc-modal' title={"报告生成"} onCancel={e => setVisible(false)} open={visible} bodyStyle={{
            height: 600
        }} width={1200} footer={[
            <Button type="primary" disabled={currentStep === 0} onClick={e => {
                setCurrentStep(currentStep => --currentStep)
            }}>上一步</Button >,
            <Button loading={loading} type="primary" disabled={(currentStep === items.length - 1) || (!zhData) || (!yxfxData)} onClick={e => {
                if (mapRef.current?.loadData) {
                    setLoading(true)
                    mapRef.current?.loadData?.()?.then(data => {
                        setResult(result => {
                            return {
                                ...result,
                                ['mapData' + currentStep]: data
                            }
                        })
                        setCurrentStep(currentStep => ++currentStep)
                    }).finally(e => {
                        setLoading(false)
                    });
                } else {
                    setCurrentStep(currentStep => ++currentStep)
                }
            }}>下一步</Button>
        ]}>
            <div className='wh100 layout-v'>
                <Steps items={items} current={currentStep} onChange={current => {
                    // setCurrentStep(current)
                }}></Steps>
                {currentStep === 0 && <Zqxq />}
                {currentStep === 1 && <MapGenerator step={currentStep} ref={mapRef} />}
                {currentStep === 2 && <MapGenerator step={currentStep} ref={mapRef} />}
                {currentStep === 3 && <MapGenerator step={currentStep} ref={mapRef} />}
                {currentStep === 4 && <MapGenerator step={currentStep} ref={mapRef} />}
                {currentStep === 5 && <Scbg result={result} />}
            </div>
        </Modal>
    </>
}